<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  	<title>web course</title>

    <link rel="stylesheet" href="./css/style.css" type="text/css" media="screen" />

	<script src="./jet/js/jx.core.js" type="text/javascript"></script>
	<script src="./jet/js/jx.array.js" type="text/javascript"></script>
	<script src="./jet/js/jx.dom.js" type="text/javascript"></script>
	<script src="./jet/js/jx.event.js" type="text/javascript"></script>
	<script src="./jet/js/jx.http.js" type="text/javascript"></script>
	<script src="./jet/js/jx.string.js" type="text/javascript"></script>
</head>
<body>
	<button id="load-html">load html</button>
	<button id="load-json">load json</button>
	<button id="load-js">load js</button>
	<div id="dictionary"></div>

	 <script type="text/html" id="user_tmpl">
	 	<% for ( var i = 0; i < users.length; i++ ) { %>
	 	<li><a href="<%=users[i].url%>"><%=users[i].name%></a></li>
	 	<% } %>
	 </script>

	<script type="text/javascript">

	 Jx().$package(function(J){
	 
	 	this.render = function(target, tmplId, data, isPlus){  
	        var html = J.string.template(tmplId, data);
	        if(typeof target === 'string'){
	            target = J.dom.id(target);
	        }
	        if(isPlus){
	            var tempNode = $D.node('div');
	            tempNode.innerHTML = html;
	            var nodes = tempNode.children;
	            while(nodes[0]){
	                target.appendChild(nodes[0]);
	            }
	            delete tempNode;
	        }else{
	            target.innerHTML = html;
	        }
    	}

	 	var data = [{name:"qq", url:"http://www.qq.com"}, {name:"netease", url:"http://www.163.com"}, {name:"sina", url:"http://www.sina.com"}];
	  	// 用 obj 对象的数据合并到字符串模板中
	 	//J.string.template("user_tmpl", {users:data});

	 	render("dictionary", "user_tmpl", {users:data}, false);
	 });
	</script>
</body>
</html>